<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core">

<ui:composition template="template/base.xhtml">

    <ui:define name="content">
        <h:outputStylesheet library="css" name="index.css"/>
        <h:outputScript library="js" name="index.js"/>
        <h:form>
            <h:commandButton class="adminLoginBtn" action="adminLogin?faces-redirect=true"
                             value="Login as Administrator"/>
            <h:inputText class="datepicker" value="#{mainController.filterDate}">
                <f:convertDateTime pattern="MM/dd/yyyy"/>
                <f:ajax event="valueChange" render="dataTable" listener="#{mainController.filter}"/>
            </h:inputText>
            <br></br><br></br>
            <h:dataTable id="dataTable" value="#{mainController.filteredTimeTables}" var="timeTable"
                         styleClass="cinemaTable"
                         headerClass="cinemaTableHeader"
                         rowClasses="cinemaTableOddRow,cinemaTableEvenRow">
                <h:column>
                    <f:facet name="header">Movie</f:facet>
                    <h:commandLink id="showDetails" value="#{timeTable.movie.title}" target="showDetails"
                                   onclick="window.open('','showDetails','status=no,toolbar=no,menubar=no,resizable,width=1200,height=800,left=340,top=120');"
                                   action="#{movieBean.process}">
                        <f:param name="movieId" value="#{timeTable.movie.mId}"/>
                    </h:commandLink>
                </h:column>
                <h:column>
                    <f:facet name="header">Start time</f:facet>
                    <h:outputText value="#{timeTable.startTime}">
                        <f:convertDateTime
                            pattern="yyyy/MM/dd HH:mm"/>
                    </h:outputText>
                </h:column>
                <h:column>
                    <f:facet name="header">Room</f:facet>
                    <h:outputText value="#{timeTable.room.name}"/>
                </h:column>
            </h:dataTable>
        </h:form>
    </ui:define>
</ui:composition>
</html>